import 'package:flutter_base_framework/base_framework_export.dart';
import 'package:flutter_base_app/model/test_data.dart';
import 'package:flutter_base_app/widgets/image/image_widget.dart';
import 'package:flutter/material.dart';
import 'package:flutter_refresh/flutter_refresh_export.dart';
import '../vm/demo_vm.dart';

class DemoPage extends BasePage {
  const DemoPage({super.key});

  @override
  State<DemoPage> createState() => _DemoPageState();
}

class _DemoPageState extends BaseMvvmState<DemoPage, DemoVm> {
  _DemoPageState() : super(DemoVm());

  @override
  void initState() {
    initRefreshCtrl();
    super.initState();
    title.value = "Demo";
    vm.refreshData(isShowLoading: true);
  }

  @override
  Widget buildWidget(BuildContext context) {
    return Column(
      children: <Widget>[
        Expanded(
            child: AppRefresh(
          controller: vm.requireRefreshCtrl,
          onRefresh: () async {
            vm.page = 0;
            vm.refreshData(isShowLoading: false);
          },
          onLoad: () async {
            vm.refreshData(isShowLoading: false);
          },
          child: ListView.builder(
            itemCount: vm.dataList.length,
            itemBuilder: buildItem,
          ),
        )),
      ],
    );
  }

  @override
  void dispose() {
    super.dispose();
  }

  Widget buildItem(BuildContext context, index) {
    TestData model = vm.dataList[index];
    return Container(
        margin: const EdgeInsets.symmetric(horizontal: 17.5, vertical: 6),
        child: Card(
          elevation: 10,
          color: Colors.white,
          shape: const RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(2))),
          clipBehavior: Clip.antiAlias,
          shadowColor: Color(0x717171),
          child: Column(
            children: [
              AspectRatio(
                aspectRatio: 340 / 160,
                child: ImageX(
                  "",
                  width: double.infinity,
                  height: 75,
                ),
              ),
              Container(
                padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 16),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      model.title,
                      maxLines: 2,
                      overflow: TextOverflow.ellipsis,
                      style: const TextStyle(fontSize: 21, color: Color(0xff1f1f1f)),
                    ),
                    const SizedBox(height: 12),
                    Text(
                      model.summary,
                      maxLines: 2,
                      overflow: TextOverflow.ellipsis,
                      style: const TextStyle(fontSize: 14, color: Color(0xff999999)),
                    ),
                    SizedBox(height: 15),
                    Text(
                      "${model.newsSrc}  ${model.pubTime}",
                      maxLines: 1,
                      overflow: TextOverflow.ellipsis,
                      style: const TextStyle(fontSize: 12, color: Color(0xff999999)),
                    )
                  ],
                ),
              ),
            ],
          ),
        ));
  }
}
// OutlinedButton(
// onPressed: () {
// LogUtils.e("OutlinedButton pressed");
// },
// child: const Text("OutlinedButton")),
// IconButton(
// onPressed: () {
// LogUtils.e("IconButton pressed");
// },
// icon: const Icon(Icons.sensor_occupied_rounded)),
// ElevatedButton(
// style: ElevatedButton.styleFrom(
// padding: EdgeInsets.zero, // 去除内边距
// backgroundColor: Colors.blue, // 背景色,
// shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
// minimumSize: const Size(double.minPositive, 30),
// ),
// onPressed: () {
// LogUtils.e("ElevatedButton Custom pressed");
// },
// child: const Text("ElevatedButton Custom")),
// const Text("Row"),
// Container(
// constraints: const BoxConstraints(
// maxWidth: 200,
// maxHeight: double.infinity,
// ),
// color: Colors.red,
// padding: const EdgeInsets.all(10),
// child: Text(
// "aaaaaaaaaaabwwwwwwwwwbbbbbbbbbb${vm.counter}",
// softWrap: false,
// overflow: TextOverflow.clip,
// maxLines: 3,
// style: const TextStyle(fontSize: 20),
// ),
// ),
// Container(
// margin: const EdgeInsets.only(top: 10),
// constraints: const BoxConstraints(
// maxWidth: 200,
// maxHeight: 40,
// ),
// child: TextField(
// decoration: const InputDecoration(
// contentPadding: EdgeInsets.all(10),
// hintText: "输入1",
// border: OutlineInputBorder(),
// floatingLabelBehavior: FloatingLabelBehavior.never,
// ),
// keyboardType: TextInputType.number,
// inputFormatters: [
// // FilteringTextInputFormatter.digitsOnly,
// // 只允许输入数字
// FilteringTextInputFormatter.allow(RegExp(r'^\d+\.?\d*$')),
// // 只允许输入数字和小数点
// ],
// onChanged: (value) {
// LogUtils.e("输入1改变: $value");
// },
// ),
// ),
// Image.asset(
// Assets.imgIcTips,
// width: 100,
// height: 100,
// ),
// SvgPicture.asset(Assets.svgIcSuccess, width: 100, height: 100),
// Text(
// '${vm.counter}',
// style: Theme.of(context).textTheme.headlineMedium,
// ),
